import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:jet_rails/jr_app/jr_models/jr_activity_model.dart';
import 'package:jet_rails/jr_app/jr_views/jr_home/jr_activity_detail_view.dart';
import 'package:jet_rails/jr_app/jr_views/jr_home/jr_home_controller.dart';
import 'package:jet_rails/jr_utils/jr_snippet.dart';

class JrActivityWidget extends StatefulWidget {
  final JrActivityModel activityModel;
  final Widget? action;
  const JrActivityWidget({Key? key, required this.activityModel, this.action}) : super(key: key);

  @override
  State<JrActivityWidget> createState() => _JrActivityWidgetState();
}

class _JrActivityWidgetState extends State<JrActivityWidget> {
  JrHomeController controller = Get.find<JrHomeController>();
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
        behavior: HitTestBehavior.opaque,
        onTap: () {
          Get.to(() => JrActivityDetailView(activityModel: widget.activityModel));
        },
        child: Container(
          decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(10),
              image: const DecorationImage(
                  image: AssetImage('assets/webp/img_activity_widget_bg.webp'), fit: BoxFit.fitWidth)),
          margin: EdgeInsets.only(top: 16.h),
          padding: EdgeInsets.only(left: 12.w, right: 12.w, top: 12.h, bottom: 16.h),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Container(
                height: 188.h,
                width: 320.w,
                clipBehavior: Clip.hardEdge,
                decoration: BoxDecoration(borderRadius: BorderRadius.circular(10)),
                child: Stack(
                  children: [
                    if (widget.activityModel.thumbnail != null)
                      Positioned(
                          width: 200.w,
                          left: 0,
                          top: 0,
                          bottom: 0,
                          child: Image.asset(widget.activityModel.thumbnail!,
                              height: 188.h, width: 200.w, fit: BoxFit.cover)),
                    Positioned(
                        right: 0,
                        top: 0,
                        bottom: 0,
                        width: 133.w,
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(10),
                          child: BackdropFilter(
                              filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
                              child: Container(
                                color: const Color(0xFFD76EFF).withOpacity(0.4),
                                padding: EdgeInsets.all(8.w),
                                child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
                                  Row(
                                    mainAxisAlignment: MainAxisAlignment.end,
                                    children: [
                                      StatefulBuilder(
                                        builder: (context, setState) => GestureDetector(
                                          onTap: () {
                                            controller.toggleLike(widget.activityModel);
                                          },
                                          child: Image.asset(
                                            widget.activityModel.likedByMe
                                                ? 'assets/webp/icon_star_active.webp'
                                                : 'assets/webp/icon_star_default.webp',
                                            width: 20.r,
                                            height: 20.r,
                                          ),
                                        ),
                                      )
                                    ],
                                  ),
                                  SizedBox(height: 8.h),
                                  Text(
                                    maxLines: 1,
                                    overflow: TextOverflow.ellipsis,
                                    widget.activityModel.teamName ?? '',
                                    style: JrSnippets.commonTextStyle.merge(TextStyle(fontSize: 16.sp, height: 1.5)),
                                  ),
                                  SizedBox(height: 10.h),
                                  Text(
                                    maxLines: 1,
                                    overflow: TextOverflow.ellipsis,
                                    'Time: ${widget.activityModel.time ?? ''}',
                                    style: const TextStyle(color: Colors.white54),
                                  ),
                                  SizedBox(height: 10.h),
                                  Text(
                                    maxLines: 1,
                                    overflow: TextOverflow.ellipsis,
                                    'Place: ${widget.activityModel.place ?? ''}',
                                    style: const TextStyle(color: Colors.white54),
                                  ),
                                  SizedBox(height: 18.h),
                                  Row(
                                    children: [
                                      CircleAvatar(
                                        radius: 15,
                                        backgroundImage: widget.activityModel.author?.avatar != null
                                            ? NetworkImage(widget.activityModel.author!.avatar!)
                                            : null,
                                      ),
                                      SizedBox(
                                        width: 16.w,
                                      ),
                                      Expanded(
                                        child: Text(
                                          widget.activityModel.author?.nickname ?? '',
                                          overflow: TextOverflow.ellipsis,
                                          style: const TextStyle(color: Colors.white),
                                        ),
                                      ),
                                      SizedBox(
                                        width: 10.w,
                                      ),
                                    ],
                                  )
                                ]),
                              )),
                        )),
                  ],
                ),
              ),
              SizedBox(height: 22.h),
              Row(
                children: [
                  Expanded(
                    child: Text(
                      (widget.activityModel.attendedUser) > 0
                          ? '${widget.activityModel.attendedUser} People attended'
                          : '',
                      overflow: TextOverflow.ellipsis,
                      style: const TextStyle(color: Color(0xFFFC68FF)),
                    ),
                  ),
                  SizedBox(
                    width: 10.w,
                  ),
                  widget.action ?? Container()
                ],
              )
            ],
          ),
        ));
  }
}
